/**************** 车间总览 ****************/
.workshop-chart {
  .arrow {
    width: 56px;
    height: 56px;
    cursor: pointer;
    z-index: 1000;
    position: absolute;
    top: 290px;
    &.arrow-left {
      left: 20px;
      background: url('~@/assets/img/chart/arrow-left.png') no-repeat;
      background-size: 100% 100%;
    }
    &.arrow-right {
      right: 20px;
      background: url('~@/assets/img/chart/arrow-right.png') no-repeat;
      background-size: 100% 100%;
    }
  }
  ::-webkit-scrollbar {
    width: 6px;
    height: 0;
  }
  .platform {
    height: calc(100% - 185px);
    min-height: 576px;
    overflow-x: auto;
    display: flex;
    font-size: 16px !important;
    .content_title {
      width: 100%;
      height: 42px;
      line-height: 42px;
      text-align: center;
      color: #292b3d;
      background: #f8f9fb;
      .content_text {
        font-weight: 400;
        line-height: 42px;
        font-size: 14px;
        vertical-align: middle;
      }
      .content_img {
        width: 25px;
        height: 25px;
        vertical-align: middle;
      }
    }
    .wendu,
    .wendu1,
    .wendubottom {
      width: 34px;
      height: 23px;
      img {
        width: 100%;
        height: 100%;
      }
    }
    .dongli,
    .dongli1,
    .donglibottom {
      width: 24px;
      height: 12px;
      img {
        width: 100%;
        height: 100%;
      }
    }
    .luotong {
      flex-shrink: 0;
      display: block;
      width: 290px;
      height: 100%;
      position: relative;
      margin-right: 20px;
      background: rgb(252, 253, 254);
      .luotong_body {
        width: 100%;
        height: 78%;
        position: absolute;
        top: 15%;
        .luotong_row1 {
          width: 100%;
          height: 30%;
          display: flex;
          // padding-top: 15px;
          // border: 1px solid #000;
          justify-content: space-around;
        }
        .luotong_row2 {
          margin-top: 30px;
          .dongli,
          .wendu,
          .wendu1 {
            position: absolute;
          }
          .dongli {
            top: -20px;
          }
          .wendu {
            bottom: 15px;
          }
        }
        .luotong_row3 {
          margin-top: 10px;
          .wendu1 {
            position: absolute;
          }
          .dongli {
            position: absolute;
            top: -20px;
          }
          .wendu1 {
            bottom: 15px;
          }
        }

        .luotong_row2,
        .luotong_row3 {
          width: 100%;
          display: flex;
          height: 30%;
          margin-left: 35px;
          position: relative;
          .item,
          .item1 {
            margin-right: 3px;
          }
          .item:nth-child(7),
          .item1:nth-child(6) {
            margin-right: 15px;
          }

          // border: 1px solid #000;
        }
      }
    }
    .xisha_1 {
      flex-shrink: 0;
      width: 380px;
      display: block;
      height: 100%;
      position: relative;
      margin-right: 20px;
      background: rgb(252, 253, 254);
      .xisha_body {
        width: 100%;
        height: 78%;
        position: absolute;
        top: 15%;
        .xisha_row1 {
          justify-content: space-around;
          width: 100%;
          height: 40%;
          display: flex;
          // border: 1px solid #000;
          .item:nth-child(4),
          .item:nth-child(9),
          .item:nth-child(14),
          .item:nth-child(19),
          .item:nth-child(24),
          .item:nth-child(29) {
            margin-right: 5px;
          }
          .dongli,
          .wendu {
            position: absolute;
          }
          .dongli {
            top: -20px;
          }
          .wendu {
            margin-top: 90px;
          }
        }
      }
    }
    .xisha_2 {
      flex-shrink: 0;
      width: 610px;
      display: block;
      height: 100%;
      position: relative;
      margin-right: 20px;
      background: rgb(252, 253, 254);
      .xisha_body {
        width: 100%;
        height: 78%;
        position: absolute;
        top: 15%;
        .xisha_row3 {
          margin-top: 30px;
        }
        .xisha_row4 {
          margin-top: 10px;
        }

        .xisha_row2,
        .xisha_row3,
        .xisha_row4 {
          position: relative;
          justify-content: space-around;

          width: 100%;
          height: 30%;
          display: flex;
          .item1:nth-child(5),
          .item1:nth-child(10),
          .item1:nth-child(15),
          .item1:nth-child(20),
          .item1:nth-child(24),
          .item1:nth-child(29),
          .item1:nth-child(34),
          .item1:nth-child(39),
          .item1:nth-child(44),
          .item1:nth-child(49) {
            margin-right: 5px;
          }
          .dongli,
          .wendu,
          .donglibottom,
          .wendubottom,
          .wendu1 {
            position: absolute;
          }
          .dongli {
            top: -20px;
          }
          .donglibottom {
            top: -20px;
          }
          .wendubottom,
          .wendu1,
          .wendu {
            bottom: 20px;
          }
        }
      }
    }
    & > .cusha {
      background: rgb(252, 253, 254);
      margin-right: 20px;
    }
    .cusha {
      flex-shrink: 0;
      width: 172px;
      display: block;
      height: 100%;
      position: relative;
      .cusha_body {
        width: 100%;
        height: 78%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        .cusha_item {
          height: 6%;
          box-sizing: border-box;
          .cusha {
            width: 52px;
          }
          .dongli,
          .dongli1 {
            position: absolute;
          }
          .dongli,
          .dongli img {
            width: 12px;
            height: 28px;
          }
          .dongli {
            left: 30px;
          }
          .dongli1 {
            bottom: 14%;
          }
        }
      }
    }
    .jingtiao {
      flex-shrink: 0;
      width: 200px;
      display: block;
      height: 100%;
      position: relative;
      background: rgb(252, 253, 254);
      margin-right: 20px;
      .jingtiao_body {
        width: 100%;
        height: 78%;
        position: absolute;
        display: flex;
        top: 72px;
        .jingtiaoCol {
          width: 40%;
          margin-left: 10%;
        }
        .jingtiao_item {
          height: 6%;
        }
        .dongli {
          position: absolute;
        }
        .dongli {
          top: -20px;
          left: 20px;
        }
      }
    }
    & > .liumian {
      flex-shrink: 0;
      width: 200px;
      background: rgb(252, 253, 254);
      margin-right: 20px;
    }
    .liumian {
      display: block;
      height: 100%;
      position: relative;
      .liumian_body {
        width: 100%;
        height: 78%;
        position: absolute;
        left: 0;
        top: 15%;
        .liumianRol {
          width: 100%;
          height: 18%;
          display: flex;
          justify-content: center;
          .liumian_item {
            margin-right: 5px;
          }
          .dongli,
          .dongli img {
            width: 12px;
            height: 28px;
          }
          .dongli {
            position: absolute;
            right: 10px;
          }
        }
      }
    }
    .lvchen_qinghua {
      display: flex;
      width: 290px;
      height: 100%;
      flex-shrink: 0;
    }
    .lvchen {
      width: 105px;
      display: block;
      height: 100%;
      position: relative;
      margin-right: 20px;
      background: rgb(252, 253, 254);
      .qinghua_body {
        top: 16%;
        width: 100%;
        height: 78%;
        position: absolute;
        display: flex;
        .qinghuaCol1 {
          width: 50%;
          position: absolute;
          left: 36%;
          .lvchen_item {
            margin-bottom: 30px;
          }
        }
      }
    }
    .qinghua {
      flex-shrink: 0;
      width: 164px;
      display: block;
      height: 100%;
      position: relative;
      background: rgb(252, 253, 254);
      .qinghua_body {
        width: 100%;
        height: 78%;
        top: 15%;
        position: absolute;
        display: flex;
        .qinghuaCol1 {
          width: 50%;
          position: absolute;
          left: 8%;
        }

        .qinghuaCol2 {
          position: absolute;
          left: 20%;
          .item {
            width: 100%;
            display: flex;
            justify-content: space-around;
          }
          .dongli {
            position: absolute;
            left: -25px;
          }
          .qinghuaCol2_item2 {
            margin-top: 25px;
          }
        }
      }
      .dongli,
      .dongli img {
        width: 12px;
        height: 28px;
      }
    }
  }
  .legend {
    width: 940px;
    height: 173px;
    display: flex;
    background: #f6f9fc;
    color: #292b3d;
    margin-top: 12px;
    .title {
      width: 50px;
      background: #e6eff8;
      color: #292b3d;
      writing-mode: vertical-lr;
      text-align: center;
      line-height: 50px;
      font-weight: 500;
    }
    .content {
      flex-grow: 1;
      padding: 16px;
      .img-item {
        width: 56px;
        text-align: center;
        & + .img-item {
          margin-left: 4px;
        }
        .img {
          height: 40px;
          display: flex;
          justify-content: center;
          align-items: center;
          margin-bottom: 5px;
        }
      }
      span {
        font-weight: 500;
      }
      .legend-row {
        display: flex;
        margin: 25px 0 13px 0;
        .legend-item {
          display: flex;
          align-items: center;
          margin-right: 16px;
          .legend-img {
            width: 20px;
            height: 13px;
            margin-right: 10px;
          }
        }
      }
    }
  }
}
.custom-dialog.el-dialog {
  border-radius: 10px;
  .el-dialog__header {
    height: 62px;
    line-height: 62px;
    padding: 0 25px;
    border-bottom: 1px solid #cfd4d8;
    .title_top {
      color: #48556a;
      font-size: 17px;
    }
    .el-dialog__headerbtn {
      width: 22px;
      height: 22px;
      color: rgb(126, 141, 162);
      border: 1px solid rgb(126, 141, 162);
      border-radius: 50%;
      line-height: 22px;
    }
  }
  .status-circle {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    margin: 0 4px;
  }
  .title_item {
    color: #292b3d;
    font-weight: 500;
    padding-left: 10px;
    display: flex;
    align-items: center;
    margin-bottom: 4px;
    span:first-child {
      white-space: nowrap;
    }
    .title_value {
      font-weight: 300;
    }
  }
  .table-column {
    width: 34px;
    height: 150px;
    background: #e6ebf6;
    color: #292b3d;
    writing-mode: tb-rl;
    font-size: 13px;
    text-align: center;
    line-height: 34px;
    letter-spacing: 2px;
  }
  .table-column + .el-table {
    .el-table__body-wrapper.is-scrolling-none {
      height: 113px !important;
    }
  }
}
